<template>
	<view>
		<!-- 顶部导航栏 -->
		<view>
			<u-navbar title="手机注册" ></u-navbar>
		</view>
		<!-- 分割线 -->
		<view class="line"></view>
		<!-- 页面注册板块 -->
		<u-form :model="user" ref="uForm" class="form">
			<u-form-item label="姓名" prop="xingming" labelWidth="160" leftIcon="man-add">
				<u-input v-model="user.xingming" class="form-item" placeholder="请输入你的名字" />
			</u-form-item>
			<u-form-item label="账号" prop="zhanghao" labelWidth="160" leftIcon="account">
				<u-input v-model="user.zhanghao" class="form-item" placeholder="请输入你的账号" />
			</u-form-item>
			<u-form-item label="登录密码" prop="mima" labelWidth="160" leftIcon="lock">
				<u-input v-model="user.mima" class="form-item" placeholder="请输入密码" />
			</u-form-item>
			<u-form-item label="年龄" prop="age" labelWidth="160" leftIcon="hourglass">
				<u-input v-model="user.age" class="form-item" placeholder="请输入年龄" />
			</u-form-item>
			<u-form-item label="会员类型" label-width="140" label-position="left" prop="leibie">
				<u-radio-group v-model="user.leibie" @change="radioGroupChange">
					<u-radio @change="radioChange" v-for="(item, index) in list" :key="index" :name="item.val"
						:disabled="item.disabled" active-color="#25afa2">
						{{item.txt}}
					</u-radio>
				</u-radio-group>
 
			</u-form-item>
		</u-form>
		<u-button @click="submit" class="">注册</u-button>
	</view>
</template>
 
<script>
	export default {
		data() {
			return {
				// avatar: 'https://cdn.uviewui.com/uview/common/logo.png',
				user: {
					xingming: '',
					zhanghao: '',
					mima: '',
					age: '',
					leibie:''
				},
				list: [{
					val:'0',
					txt: "超级用户",
					disabled: false //不禁用所有单选框
					},
					{
						val:'1',
						txt: "普通用户",
						disabled: false //不禁用所有单选框
					},
					{
						val:'2',
						txt: "电影推介",
						disabled: false //不禁用所有单选框
					}
				],
				rules: {
					// 字段名称
					xingming: [
						{
							required: true,
							message:'咋啦，你没名没姓？',
							trigger: 'change'
						}

					],
					zhanghao: [
					{
						required: true,
						message:'账号不输入你后面登陆个锤锤',
						trigger: ['change','blur']
					},
					{
						max:12,
						message:'账号这么长你那猪脑能记住？最多12个字符！',
						trigger: ['change','blur']	
					}
					],
					mima: 
					[{
						required: true,
						message:'不设置密码的话我盗你号做点坏事，嘿嘿嘿',
						trigger: ['change','blur']
					},
					{
						min:3,
						message:'这么短的密码你那猪脑都记不住？至少3个字符！',
						trigger: 'change'
					},
					{
						max:6,
						message:'这么长的密码你那猪脑能记住？最多6个字符！',
						trigger: 'change'
					}
					],
					age: 
					[{
						required: true,
						message: "年龄是不能说的秘密？",
						trigger: "blur"
					}],
					
					
				}
			}
		},
		methods: {
			// 选中某个单选框时，由radio时触发
			radioChange(e) {
				// console.log(e);
			},
			// 选中任一radio时，由radio-group触发
			radioGroupChange(e) {
				// console.log(e);
			},
			submit(){
				//打印
				console.log('注册')
				//网络提交数据
				uni.request({
					url:"http://localhost:9090/doRegister",
					method:"POST",
					data:this.user,
					success:(res)=>{
						console.log(res);
						if(res.data.code*1==200)
						{
							uni.navigateBack()
						}
						else{
							this.$u.toast("注册失败！")
						}
					}  //res接受响应
				});
				//成功则返回
				//uni.navigateBack();
			},
		},
		// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		}
	}
</script>
 
<style lang="scss" scoped>
	.line {
		width: 100%;
		height: 20rpx;
		background-color: #DDDDDD;
	}
 
	.form {
		width: 95%;
		margin: auto;
 
		.form-item {
			margin-left: 50rpx;
		}
	}
</style>

